<template>
  <div>
    <el-row :gutter="24" class="mb8" style="margin-top: 20px;">
      <el-col :span="24">
        <el-button style="margin-right: 10px" :type="isChangeBtn?'primary':''" @click="checkTotalHandle()">总分抽验</el-button>
        <el-button style="margin-left: 0" :type="isChangeBtn?'':'primary'" @click="checkSingleHandle()">单科抽验</el-button>
      </el-col>
    </el-row>
    <div v-show="isChangeBtn">
      <total-asw-list
        :anStatusList="anStatusList"
        :eStatusList="eStatusList"
        :mqStatusList="mqStatusList"
        :checkStatusList="checkStatusList"
      ></total-asw-list>
    </div>
    <div v-show="!isChangeBtn">
      <single-asw-list
        :anStatusList="anStatusList"
        :mqStatusList="mqStatusList"
        :checkStatusList="checkStatusList"
      ></single-asw-list>
    </div>
  </div>
</template>

<script>
  import totalAswList from "@/components/ToolSystem/Grade/totalAswList"
  import singleAswList from "@/components/ToolSystem/Grade/singleAswList"
  export default {
    name: "sampleAnswer",
    components: {
      totalAswList,
      singleAswList
    },
    data() {
      return {
        isChangeBtn: true,
        anStatusList: [],// 算分答案状态列表
        eStatusList: [],// 考位状态列表
        mqStatusList: [], // MQ答案状态列表
        checkStatusList: [],// 抽验状态列表
      };
    },
    created() {
      this.getDicts("answer_source").then(response => {
        this.anStatusList = response.data;
      });
      this.getDicts("e_status").then(response => {
        this.eStatusList = response.data;
      });
      this.getDicts("mqStatus").then(response => {
        this.mqStatusList = response.data;
      });
      this.getDicts("spotCheckStatus").then(response => {
        this.checkStatusList = response.data;
      });
    },
    methods: {
      checkTotalHandle(){
        this.isChangeBtn = true
      },
      checkSingleHandle(){
        this.isChangeBtn = false
      },
    }
  };
</script>

<style lang="scss">
  @import "@/assets/styles/card.scss";
</style>

